<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>体侧记录</title>
    <script src="js/flexible.js"></script>
    <link rel="stylesheet" href="css/flexible.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/vue/vue.js"></script>
    <script src="js/vue/axios.js"></script>
    <script src="js/vue/MD5.js"></script>
</head>
<body>

<div class="tc_record_list" id="app">
<template>
    <div v-if="sideRecord.length>0">
        <div v-for="(item,index) in sideRecord" class="borderBottom">
            <div class="tc_record_head">
                <div class="l">
                    <div class="name">记录时间</div>
                    <div class="value">{{item.Addtime}}</div>
                    <div class="clear"></div>
                </div>
                <div class="r">
                    <div class="name">记录人</div>
                    <div class="value">{{item.Addname}}</div>
                    <div class="clear"></div>
                </div>
                <div class="clear"></div>
            </div>
            <div class="tc_record_table">
                <div class="l">
                    <div class="list">
                        <div class="name">身高</div>
                        <div class="value">{{item.Height}}</div>
                        <div class="clear"></div>
                    </div>
                    <div class="list">
                        <div class="name">体重</div>
                        <div class="value">{{item.Weight}}</div>
                        <div class="clear"></div>
                    </div>
                    <div class="list">
                        <div class="name">BMI</div>
                        <div class="value">{{item.Bmi}}</div>
                        <div class="clear"></div>
                    </div>
                    <div class="list">
                        <div class="name">体脂</div>
                        <div class="value">{{item.Bodyfat}}</div>
                        <div class="clear"></div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="r" v-if="currIndex==index" @click="zkSq(index)">
                    <span>收起</span>
                    <img src="images/jt_s.png">
                </div>
                <div class="r" v-else @click="zkSqS(index)">
                    <span>展开</span>
                    <img src="images/jt_x.png" >
                </div>
                <div class="l" v-if="currIndex==index">
                        <div class="list">
                            <div class="name">臀围</div>
                            <div class="value">{{item.Hipline}}</div>
                            <div class="clear"></div>
                        </div>
                        <div class="list">
                            <div class="name">胸围</div>
                            <div class="value">{{item.Bust}}</div>
                            <div class="clear"></div>
                        </div>
                        <div class="list">
                            <div class="name">腰围</div>
                            <div class="value">{{item.Thewaist}}</div>
                            <div class="clear"></div>
                        </div>
                        <div class="list">
                            <div class="name">肩宽</div>
                            <div class="value">{{item.Shoulder}}</div>
                            <div class="clear"></div>
                        </div>
                        <div class="list">
                                <div class="name">小腿围</div>
                                <div class="value">{{item.Minthigh}}</div>
                                <div class="clear"></div>
                            </div>
                            <div class="list">
                                <div class="name">大腿围</div>
                                <div class="value">{{item.Maxthigh}}</div>
                                <div class="clear"></div>
                            </div>
                        <div class="clear"></div>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
    <div class="notDate" v-else>
        <img src="images/notDate.jpg"/>
    </div>
</template>
</div>


</body>
<script>
var app = new Vue({
    el: '#app',
    data: {
        currIndex:'',
        sideRecord:[],
        from:{
            page:'1'
        }
    },
    created(){
        this.getCardList()
    },
    methods: {
        getCardList(){
            getVs()
            const params=this.from
            axios.get('/mobileapi/member/user_info.php?act=tc_record',{params:params}).then(data =>{
                console.log(data.data)
                let { msg, code,user} = data.data
                    if (code !== 200) {
                        _this.$message({
                            message: msg,
                            type: 'error'
                        });
                    } else {
                        data=data.data
                        this.sideRecord=data.data.list
                        console.log(this.sideRecord)
                    }
                }).catch(function (error) { 
                    console.log(error); 
            });
        },
        zkSq(index){
            this.currIndex=index+1
        },
        zkSqS(index){
            this.currIndex=index
        },
    }  
})    
</script>
</html>